<template>
    <div>
        <ly-dialog v-model="dialogVisible" :title="loadingTitle" width="950px" :before-close="handleClose">
            <div class="tableSelect" ref="tableSelect">
                <el-form :inline="true" :model="formInline" label-position="left">
                    <el-form-item label="建筑名称：">
                        <el-input v-model.trim="formInline.order_id" maxlength="60"  clearable placeholder="建筑名" @change="search" style="width:200px"></el-input>
                    </el-form-item>
                    <el-form-item label="小区：">
                        <el-input v-model.trim="formInline.nickname" maxlength="60"  clearable placeholder="小区" @change="search" style="width:150px"></el-input>
                    </el-form-item>
                    <el-form-item label="距离(米)">
                        <el-input v-model.trim="formInline.gname" maxlength="60"  clearable placeholder="距离" @change="search" style="width:200px"></el-input>
                    </el-form-item>
                    <el-form-item label=""><el-button  @click="search" type="primary" icon="Search">查询</el-button></el-form-item>
                </el-form>
            </div>
            <div class="table" style="height: 600px;">
                <el-scrollbar>
                    <tmap-map mapKey="kM5zkEP9wuGI7vRApG9mhNY4Yef3BWLl'" :center="center" :zoom="zoom" :control="control">
                        <tmap-multi-label :id="id" :styles="styles" :geometries="geometries" />
                    </tmap-map>
                </el-scrollbar>
            </div>
        </ly-dialog>
    </div>
</template>

<script>
    import Tmap from '@map-component/vue-tmap';
    import LyDialog from "../../../components/dialog/dialog";
    export default {
        name: "analysis",
        components: {Tmap,LyDialog},
        data(){
            return{
                dialogVisible:false,
                loadingSave:false,
                loadingTitle:'',

                isFull:false,
                loadingPage:false,
                formInline:{
                    name:'',
                    type:3,
                    page: 1,
                    limit: 10,
                },
                center:{ lat: 39.984120, lng: 116.307484 },
                zoom:10,
                geometries:[
                    {
                        id: 'label', // 点图形数据的标志信息
                        styleId: 'label', // 样式id
                        position: { lat: 39.984120, lng: 116.272305 }, // 标注点位置
                        content: '腾讯北京总部aaa', // 标注文本
                        properties: {
                        // 标注点的属性数据
                        title: 'label',
                        },
                    },
                ],
                styles:{
                    label: {
                        color: '#3777FF', // 颜色属性
                        size: 20, // 文字大小属性
                        offset: { x: 0, y: 0 }, // 文字偏移属性单位为像素
                        angle: 0, // 文字旋转属性
                        alignment: 'center', // 文字水平对齐属性
                        verticalAlignment: 'middle', // 文字垂直对齐属性
                    },
                },
                control: {
                scale: {},
                zoom: {
                        position: 'bottomRight',
                    },
                }
            }
        },
        methods: {
            async initMap() {
            },
            addModuleFn(item,flag,category) {
                this.loadingTitle=flag
                this.dialogVisible=true
            },
            handleClose() {
                this.dialogVisible=false
                this.loadingSave=false
                this.formData = {
                    name:"",
                    sort:0,
                    prefix:"",
                }
                this.$emit('refreshData')
            },
        },
        created() {
            this.initMap();
        },
    }
</script>
<style lang="scss" scoped>
    .lycontainer{
        width: 100%;
        height: calc(100vh - 130px); //动态计算长度值
        /*overflow-x: hidden;*/
        /*overflow-y:auto;*/
    }
    .echarts-inner{
        margin-top: 1px;
    }
    ::v-deep(.el-scrollbar__bar.is-horizontal) {
        display: none;
    }
</style>